<template>
  <div id="editBondDetail">
    <div class="homeTitle">债券交易申请</div>
    
    <div class="tableBox">
      <div>
        <div class="tableTitle">申请人信息： </div>
      <el-form class="formlist" :model="formData1"  :inline="true" :rules="rules">
                    <el-form-item v-for="item in formList1" :key="item.label" :label="item.label" :prop="item.prop">
                    {{formData1[item.prop]}}
                    </el-form-item>
           </el-form>
      </div>
       <div >
         <div class="tableTitle">交易详情： </div>
          <el-form class="formlist" :model="formData2"  :inline="true" :rules="rules">
                    <el-form-item v-for="item in formList2" :key="item.label" :label="item.label" :prop="item.prop">
                    <!-- {{formData[item.prop]}} -->
                    <template v-if="item.btn">
                      <span style="margin-left:-30px;margin-right:45px">{{formData2['cFull']}}</span>
                        <el-button type="text" @click="selectAginst">点击选择交易对手</el-button>
                    </template>
                    <template v-else>{{formData2[item.prop] ? formData2[item.prop] : '暂无数据'}}</template>
                    </el-form-item>
           </el-form>
      </div>
      <div >
      <div class="tableTitle">存单信息： </div>
      <el-form class="formlist" :model="formData3"  :inline="true" :rules="rules">
                    <el-form-item v-for="item in formList3" :key="item.label" :label="item.label" :prop="item.prop">
                    <!-- {{formData3[item.prop]}} -->

                    <template v-if="item.btn">
                      <span style="margin-left:-30px;margin-right:45px">{{formData3['code']}}</span>
                        <el-button type="text" @click="gozs">点击选择存单</el-button>
                    </template>
                    <!-- <template v-else-if="formData3[item.prop] == ''">
                      暂无数据
                    </template> -->
                    <template v-else>
                      {{(formData3[item.prop] == null || formData3[item.prop] == '') ?  '暂无数据' : formData3[item.prop]}} 
                    </template>
                    </el-form-item>
           </el-form>
      </div>
      <div>
        <div class="tableTitle">交易详情</div>
        <formList :formData = 'formData' @goMzmx="goMzmx" @selectChange = 'isMai' :formList = 'formList' parentClass = 'formll'></formList>
      </div>
          <div style="width:98%">
        <div class="tableTitle">审核记录</div>
        <el-table ref="singleTable" :data="recordShen" border   
              style="width: 100%"
              >
           
            <el-table-column prop="userRole" label="审核角色" align="center"></el-table-column>
            <el-table-column prop="userName" label="用户名称" align="center"></el-table-column>

            <el-table-column prop="content" label="审核意见" align="center"></el-table-column>
            <el-table-column prop="createTime" label="审核时间" align="center"></el-table-column>
            
          </el-table>
       </div>
      <div class="tablecon second" style="width:98%" v-show="selectedData.length > 0">
         <div class="tableTitle">已选定卖债明细：</div>
        <el-table :data="selectedData" border style="width: 100%">
          <el-table-column prop="model" label="交易类型"  align="center"></el-table-column>
          <el-table-column prop="transactionNumber" label="交易编号"  align="center"></el-table-column>
          <el-table-column prop="surplusMoney" label="剩余面额(万元)"  align="center"></el-table-column>
          <el-table-column prop="money" label="卖出面额(万元)" align="center">
          </el-table-column>
          <el-table-column prop="settlementDate" label="结算日期" align="center"></el-table-column>
          <el-table-column prop="price" label="买入净价(元/百元面额)" align="center"></el-table-column>
          <el-table-column prop="full" label="买入全价(元/百元面额)" align="center"></el-table-column>
          <el-table-column prop="rate" label="到期收益率(%)" align="center"></el-table-column>
          <el-table-column prop="interest" label="应计利息(元/百元面额)" align="center"></el-table-column>
         
        </el-table>
      </div>
      <div class="riskTip" style="width:98%">
            <div class="fxtq tableTitle"><span style="color:red">*</span>申请事由：</div>
            <div class="fxcon">
              <el-input type="textarea" placeholder="请输入申请事由" v-model="reason"></el-input>
            </div>
        </div>
      <div class="riskTip" style="width:98%" v-show="tishiMessage != ''">
        <div class="fxtq tableTitle">风险提醒：</div>
        <div class="fxcon">
          {{tishiMessage}}
        </div>
      </div>
      <el-dialog title="选择下一待办人" :visible.sync="nextManager" width="30%" center>
           <div v-show="nextManager">
          <!-- <div  class="tableTitle">下一代理人</div> -->
           <el-radio-group v-model="nextUserId">
            <el-radio v-for="item in tableData" :key="item.id"  :label="item.id">
              <span class="user_name">{{item.name}}</span>
              <span class="user_part">{{item.department}}</span>
              </el-radio>
          </el-radio-group>
          
        </div>
          <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="addApply" size="small">确认</el-button>
          <el-button @click="cancleNext"  size="small">取 消</el-button>
      </span>
      </el-dialog>
      <div class="btn">
        <!-- <el-button type="primary" size="small" @click="close">暂存</el-button> -->
        <el-button type="primary"  size="small"  @click="submitPost">提交</el-button>
        <el-button type="primary" @click="goback" size="small">取消</el-button>
      </div>
    </div>
    <el-dialog title="风险预警信息" :visible.sync="centerDialogVisible" center>
      <div class="DiaFxcon">
        <p>{{tishiMessage}}</p>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="getFlow" size="small">继续</el-button>
        <el-button @click="centerDialogVisible = false" size="small">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "accountDetail",
  data() {
    return {
      centerDialogVisible: false,
      nextManager: false,
      tableData: [],
      nextUserId: '',
      step: 1,
      isAuthorization: 2,
      reason: '',
      recordShen: [],
      rules:{

      },
      tishiMessage:'',
      formList1: [
        {label: '机构编号', prop: 'no', value:''},{label: '机构名称', prop: 'bank', value:''},
        {label: '操作员工号', prop: 'jobNum', value:''},{label: '操作员姓名', prop: 'name', value:''},
      ],
      formData1: {},
      formList2: [
        {label: '交易对手', prop: 'cFull', value:'', btn: true},{label: '交易机构类型', prop: 'types', value:''},
        {label: '业务类型', prop: 'type', value:''},{label: '开户行', prop: 'openBank', value:''},
        {label: '账户名称', prop: 'accountName', value:''},{label: '账号', prop: 'number', value:''},
        {label: '支付系统行号', prop: 'payment', value:''},{label: '托管机构', prop: 'trusteeship', value:''},
        {label: '托管账户名称', prop: 'trusteeshipAccountName', value:''},{label: '托管账号', prop: 'managedAccount', value:''},
      ],
      formData2: {},
        formList3: [
        {label: '存单代码', prop: 'code', value:'', btn: true},{label: '存单全称', prop: 'name', value:'', btn: false},
        {label: '存单简称', prop: 'simple', value:''},{label: '存单性质', prop: 'nature', value:''},
        {label: '存单记账品种', prop: 'bookVariety', value:''},{label: '币种', prop: 'currency', value:''},
        {label: '面额(元)', prop: 'denomination', value:''},{label: '发行价格(元/百元面值)', prop: 'price', value:''},
        {label: '计划发行总额(万元)', prop: 'planSum', value:''},{label: '实际发行总额(万元)', prop: 'actualSum', value:''},
        {label: '还本方式', prop: 'repaymentMethod', value:''},{label: '还本类型', prop: 'repaymentType', value:''},
        {label: '起息日期', prop: 'fromDate', value:''},{label: '存单期限', prop: 'maturity', value:''},
        {label: '兑付日期', prop: 'paymentDate', value:''},{label: '计息基础', prop: 'bassisDay', value:''},
        {label: '计息方式', prop: 'bearingMethod', value:''},{label: '利率类型', prop: 'rateType', value:''},
        {label: '票面利率(%)', prop: 'couponRate', value:''},
      ],
      formData3: {},
      formData:{},
      formList: [
        {label : '交易类型', value:'hhh', prop:'type', select: true,
        options: [
            {label: '现券买卖', value: '现券买卖'},
            {label: '分销', value: '分销'}
           
        ]},
        {label : '交易方向', value:'hhh', prop:'direction', select: true,
         options: [
            {label: '买入', value: '买入'},
            {label: '卖出', value: '卖出'}
           
        ]},
        {label : '券面总额（万元）', value:'是', prop:'totalFace', disabled: false, input: true},
        {label : '交易日期', value:'是', prop:'transactionDate',date: true}, 
        {label : '清算速度', value:'hhh', prop:'clearSpeed', select: true,
         options: [
            {label: 'T+0', value: 'T+0'},
            {label: 'T+1', value: 'T+1'}
        ]},
        {label : '净值（元/百元面值）', value:'是', prop:'netWorth',input: true}, 
        {label : '到期收益率（%）', value:'是', prop:'yield',input: true}, 
        {label : '结算方式', value:'hhh', prop:'settlementMethod', select: true,
         options: [
            {label: '传统', value: '传统'},
            {label: 'DVP', value: 'DVP'}
        ]},
        {label : '是否包含交易性金融负债', value:'是', prop:'includeTransactional',select: true,
        options: [
            {label: '是', value: '是'},
            {label: '否', value: '否'}
        ]},
        
        {label : '交易性金融负债(万元)', value:'是', prop:'financialLiabilities', disabled: false, input: true}, 
        {label : '卖债明细', value:'卖债明细', disabled: true, prop:'',btn: true}, 
      ],
      boundId: '',
      multipleSelection: [],
      selectedData: []
    };
  },
  methods: {
       goback() {
         this.clearSession()
      this.$router.go(-1)
    },
     //审核状态
      selectState(val) {
        if(val.state == 1 || val == '1') {
          return '已审批'
        }
        else{
          return '审批不通过'
        }
      },
    cancleNext() {
      this.nextManager = false;
    },
  
    submitPost() {
      if(this.reason == '') {
        this.$message({
          type: 'warning',
          message: '请输入申请原由'
        })
      }
       
      let data = Object.assign(this.formList)
      let formda = this.formData
      for(let i = 0; i< data.length; i++) {
          if(data[i].label == '卖债明细')
          continue
        if(this.formData.includeTransactional == '否' && data[i].prop == 'financialLiabilities') {
            continue
        }
        if(formda[data[i].prop] == undefined || formda[data[i].prop] == '') {
            this.$message({
              type: 'warning',
              message: data[i].label + "不可为空"
          })
          return false
        }
      }
     if(this.step == 1 && this.formData.direction != '卖出'){
        //第一步
    let param = {
            sumMoney: this.formData['totalFace'],
            netWorth: this.formData.netWorth,
            counterpartyId: sessionStorage.getItem('counterpartyId') ? sessionStorage.getItem('counterpartyId') : this.formData.counterpartyId,
            direction: this.formData.direction,
            bondId: sessionStorage.getItem('bondId') ? sessionStorage.getItem('bondId') : this.formData.bondId
        }
      this.axios.get('innerBankSavingApply/checkRisk', {params: param}).then((res) => {
          let data = res.data.data
          
          switch(data.state) {
            case '1':  this.$message({
                          type: 'warning',
                          message: data.msg
                        });break;
            case '2': this.isAuthorization = 1;
                       this.tishiMessage = data.msg
                       this.centerDialogVisible = true;
                        this.diatitle = '省联社授权提醒'
                      break;
            case '3': 
                       
                    this.$message({
                      type: 'warning',
                      message: data.msg
                    });
                    this.tishiMessage = data.msg
                    this.centerDialogVisible = true;
                    this.diatitle = '风险预警提醒'
                    break;
            case '4': 
                      //弹出下一列表
                      this.nextManager = true;
                      this.getNextUser()
                      break;
            case '5': 
                      this.$message({
                        type: 'warning',
                        message: data.msg
                      });
                      break;
            case '6': 
                      this.$message({
                        type: 'warning',
                        message: data.msg
                      });
                      break;
            default: break;
          }
      })
      }  else {
                      // Y 的情况或者卖出   直接跳过第一步风险管控
                      this.nextManager = true;
                      this.getNextUser()
              }
      
    },
      addApply() {
      
        //获取下一办理人成功
          //添加债券
        if(sessionStorage.getItem('bondId')) {
              this.formData.bondId = sessionStorage.getItem('bondId')
        }
        
        if(sessionStorage.getItem('counterpartyId')) {
            this.formData.counterpartyAccountId = sessionStorage.getItem('counterpartyAccountId')
            this.formData.counterpartyId = sessionStorage.getItem('counterpartyId')
         }
        this.formData.nextUserId = this.nextUserId
      this.formData.id = null
        this.formData.fileUrl = null

        if(this.isAuthorization == 1 ){
          this.formData.isAuthorization = 1
        }else {
          this.formData.isAuthorization = 2
        }
        let sellJson = []
        if(this.selectedData.length > 0) {
          this.selectedData.forEach(item => {
            let obj = {
                bondId:  sessionStorage.getItem('bondId'),
                holdId: item.id,
                money: item.sellMoney,
                transactionNumber: item.transactionNumber,
                model: item.type,
                settlementDate: item.settlementDate,
                surplusMoney: item.remainingMoney,
                price: item.netWorth,
                full: item.fullPrice,
                rate: item.yield,
                interest: item.accruedInterest


            }
            sellJson.push(obj)
          })
        }
        this.formData.sellJson = JSON.stringify(sellJson)
        this.formData.reason = this.reason
        if(this.tishiMessage != '') {
          this.formData.warn = this.tishiMessage
        }
       
        this.axios.post('innerBankSavingApply/addOrUpdate', this.formData).then(res =>{
          if(res.data.code == 200) {
              this.$message({
              type: 'success',
              message: '提交成功'
            })
            this.clearSession()
           this.$router.go(-1)
          }else {
            this.$message({
              type: 'error',
              message:'服务器出错或信息填写错误'
            })
          }
          
        })
    },
    getNextUser(flowId) {
      let param = {
        roleName: '交易员',
        flowId: flowId
      }
      this.axios.get('innerBankSavingApply/getNextUser', {
        params: param
      }).then((res) => {
          this.tableData = res.data.data.nextUser
          
      })
    },
    goMzmx(val) {
      if(sessionStorage.getItem('bondId')) {

      } else {
        sessionStorage.setItem('bondId', this.formData.bondId)
      }
      this.formData.reason = this.reason
        sessionStorage.setItem('jyinfo', JSON.stringify(this.formData))
        this.$router.push({path: 'SellingDebts', query: {total: this.formData.totalFace}})
    },
      isMai(val) {
      //是否包含交易性金融负债
      let len = this.formList.length
        // 交易性金融负债
           if(this.formData['includeTransactional'] == '是' && this.formData['financialLiabilities'] == undefined){
          
               this.formList[len-2].disabled = false
               this.$message({
                   type: 'warning',
                   message: '请填写交易性金融负债'
               })
           }else if(this.formData['includeTransactional'] == '否'){
                this.formList[len-2].disabled = true
                this.formData.financialLiabilities = ''
           }
    },
    getFlow() {
      // 开始第二步
       this.centerDialogVisible = false;
        this.nextManager = true;
        this.getNextUser()
    },
    getOppoAccountInfo() {
      //交易对手账户信息
      let param = {
        accountId: sessionStorage.getItem('counterpartyAccountId')
      }
      this.axios.get('counterparty/selectOneAccount', {params: param}).then((res) => {
        this.formData2 = res.data.data
      })
    },
    close() {
      this.$router.go(-1);
    },
    gozs() {
      this.$router.push({path:'chooseZhai', query:{mode: 1}});
    },
    selectAginst(){
      this.$router.push('chooseOpponent')
    },
    clearSession() {
      sessionStorage.removeItem('counterpartyAccountId')
      sessionStorage.removeItem('counterpartyId')
      sessionStorage.removeItem('bondId')
      sessionStorage.removeItem('mzData')
      sessionStorage.removeItem('jyinfo')
    },
    getBoundInfo(val) {
      this.axios.get('bond/selectOneById', {params: {
        id: val
      }}).then((res) => {
        this.formData3 = res.data.data.bond
      })
    },

    getBondFlowDetail() {
      let data = {
        applyId: this.$route.query.applyId,
        model: '同业存单交易'
      }
      this.axios.get('bondApplyFlow/selectOne', {params: data}).then(res => {
          let response = res.data.data
          this.formData = response.bondApply
          this.formData2 = response.account
          this.formData3 = response.bond
          this.formData1 = response.user
          this.recordShen = response.list

          if(this.formData.direction == '卖出') {
                let len = this.formList.length
                this.formList[len-1].disabled = false
                this.formList[2].disabled = true
          }
          this.formData2.cFull = response.counterparty.full
          this.formData2.types = response.counterparty.type
          this.formData3.fromDate = this.dateMoment(this.formData3.fromDate, 'YYYY-MM-DD')
          this.formData3.paymentDate = this.dateMoment(this.formData3.paymentDate, 'YYYY-MM-DD')
            let len = this.formList.length
        // 交易性金融负债
           if(this.formData['includeTransactional'] == '是'){
          
               this.formList[len-2].disabled = false
             
           }else if(this.formData['includeTransactional'] == '否'){
                this.formList[len-2].disabled = true
           }
          this.reason = this.formData.reason
          if(this.formData.warn != null) {
            this.tishiMessage = this.formData.warn
          }
           if(response.sellList != undefined) {
            this.selectedData = response.sellList
          }
          //  if(response.sellList != undefined) {
          //    response.sellList.forEach(item => {

          //    let obj = {
          //       bondId: sessionStorage.getItem('bondId'),
          //       id: item.holdId,
          //       sellMoney: item.money,
          //       transactionNumber: item.transactionNumber,
          //       type: item.model,
          //       settlementDate: item.settlementDate,
          //       remainingMoney: item.surplusMoney,
          //       netWorth: item.price,
          //       fullPrice: item.full,
          //       yield: item.rate,
          //       accruedInterest: item.interest
          //    }
          //     this.selectedData.push(obj)
          //    })
              
          //     let len = this.formList.length
          //     this.formList[len-1].disabled = false
          // }
            let isCounter = sessionStorage.getItem('counterpartyAccountId')
 
            if(isCounter){
              this.getOppoAccountInfo()
            }
            //卖债明细返回的
            if(sessionStorage.getItem('jyinfo') != undefined) {
              this.formData = JSON.parse(sessionStorage.getItem('jyinfo'))
              this.reason = this.formData.reason
              if(this.formData.direction == '卖出') {
                let len = this.formList.length
                this.formList[len-1].disabled = false
                this.formList[2].disabled = true
              }
            }
            if(sessionStorage.getItem('mzData') != undefined) {
              this.selectedData = JSON.parse(sessionStorage.getItem('mzData'))
            }
    
      })
    }
  },
  mounted() {
 this.getBondFlowDetail()
    //申请人信息
    let user = JSON.parse(sessionStorage.getItem('user'))
    this.formData1 = user
    let isCounter = sessionStorage.getItem('counterpartyAccountId')
   
    if(sessionStorage.getItem('bondId')){
      this.getBoundInfo(sessionStorage.getItem('bondId'))
    }
    
    if(isCounter){
      this.getOppoAccountInfo()
    }
  },
};
</script>

<style lang="scss">
#editBondDetail {

  .tableBox {
    padding-top: 10;
    color: white;
    .formlist{
      .el-form-item{
        width:49%;
        margin:0;
        border: 1px solid white;
        .el-form-item__label, .el-form-item__content{
            padding: 6px 2px;
            border-right: 1px solid white;
        }
        .el-form-item__label{
          text-align: center;
            width:45%;
            background: rgba(53,58,58,0.8);
            color:white;
            box-sizing: border-box;
        }
        .el-form-item__content{
          width:55%;
          text-align: center;
          background: rgba(53,58,58,0.55);
          box-sizing: border-box;
        }
      }
    }
    .el-table__empty-text{
      color:white;
    }
    .tableTitle {
      line-height: 36px;
      padding-left: 20px;
      margin: 12px 0;
    }
    table {
      
      border: 1px solid white;
      width: 100%;
      text-align: center;
      border-collapse: collapse;
       .el-table tr{
          background: transparent;
      }
      // margin-bottom: 20px;
      tr {
        td {
          
          &:nth-child(odd) {
            background: rgba(53, 58, 58, 0.55);
          }
          &:nth-child(even) {
            background: rgba(53, 58, 58, 0.55);
          }
        }
      }
    }
    .riskTip {
      .fxtq {
        margin-bottom: 20px;
      }
      .fxcon {
        border: 1px solid white;
        background-color: #4d534e;
        padding: 20px;
        margin-bottom: 20px;
      }
    }
    .btn {
      text-align: center;
      margin-top:20px;
    }
  }
  .DiaFxcon {
    background-color: white;
    padding: 20px 10px;
    margin-bottom: 20px;
  }
    .el-radio-group{
    width:100%;
    height: 320px;
    overflow-y: scroll;
    .el-radio{
      margin-bottom: 15px;
      width: 100%;
      display: block;
       .el-radio__label {
        width: 80%;
        display: inline-block;
          
        .user_name, .user_part {
              padding: 15px;
              width: 48%;
              display: inline-block;
              text-align: center;
              border: 1px solid #efefef
            }
      }  
     
    }
     .el-radio+.el-radio{
        margin-left: 0
      }
  }
}
</style>
